//
// Copyright (c) Microsoft. All rights reserved.
// Licensed under the MIT license.
//
// Microsoft Bot Framework: http://botframework.com
//
// Bot Framework Emulator Github:
// https://github.com/Microsoft/BotFramwork-Emulator
//
// Copyright (c) Microsoft Corporation
// All rights reserved.
//
// MIT License:
// Permission is hereby granted, free of charge, to any person obtaining
// a copy of this software and associated documentation files (the
// "Software"), to deal in the Software without restriction, including
// without limitation the rights to use, copy, modify, merge, publish,
// distribute, sublicense, and/or sell copies of the Software, and to
// permit persons to whom the Software is furnished to do so, subject to
// the following conditions:
//
// The above copyright notice and this permission notice shall be
// included in all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED ""AS IS"", WITHOUT WARRANTY OF ANY KIND,
// EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
// NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
// LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
// OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
// WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
//

.browse-button {
  position: relative;
  margin-left: 8px;
  bottom: 1px;
}

.input-container {
  margin-top: 10px;

  &.padded {
    padding-right: 115px;
  }
}

.input-container-row {
  width: 100%;

  & + div {
    margin-left: 8px;
  }
}

/* Imitates <PrimaryButton /> component styles */
.browse-button {
  & > input {
    position: absolute;
    height: 0;
    width: 0;
    pointer-events: none;
    opacity: 0;

    &:focus ~ label {
      outline: 1px solid var(--dialog-link-focus-color);
      background-color: var(--p-button-bg-focus);
      outline-offset: 2px;
    
      &::after {
        border: var(--p-button-border-focus);
      }
    }
  }

  & > label {
    display: block;
    border: none;
    position: relative;
    margin-bottom: 1px;
    min-width: 104px;
    min-height: 21px;
    line-height: 21px;
    font-size: 12px;
    text-align: center;
    font-weight: bold;
    color: var(--p-button-color);
    background-color: var(--p-button-bg);
  
    &::after {
      content: "";
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      right: 0;
      z-index: 1;
      border: var(--p-button-border);
    }
  
    &:hover {
      background-color: var(--p-button-bg-hover);
  
      &::after {
        border: var(--p-button-border-hover);
      }
    }
  
    &:active {
      background-color: var(--p-button-bg-active);
  
      &::after {
        border: var(--p-button-border-active);
      }
    }
  }
}

.multi-input-row {
  justify-content: space-between;
}

/* maintains "light" theme for the recent bots list since it's in a modal */
.theme-overrides {
  --my-bots-entry-bg: var(--neutral-4);
  --my-bots-entry-border: 1px solid transparent;
  --tab-icon-color: var(--neutral-12);
  --my-bots-path-color: var(--neutral-12);
  --focused-selected-list-item-bg: #006AB1;
  --my-bots-well-bg: var(--neutral-3);
  --my-bots-well-border: 0;
  --my-bots-scrollbar-color: rgba(136, 136, 136, 0.5);
  --my-bots-entry-color: var(--neutral-12);
}

.auto-complete-bar {
  display: flex;
  flex-flow: row nowrap;
  align-items: flex-end;
  margin-top: 16px;
  margin-bottom: 24px;
}

.row-override {
  margin-top: 4px;
  align-items: center;
}
